em.loginDlg = function() {
	var username = '';
	var init = false;
	var callCnt = 0;
	function installhandler(){
		debug.log(this, 'this', this, 'start right now : instll click handler ');
		
			// confirm change user
		$('.d-login > input:image').click( function() {
			$('#mask').hide();
			$('.modal_window').hide();
			em.controller.login(getSelectedName());
			

		});
		
						//if mask is clicked ==> canceled !!
		$('#mask').click(function () {
			$(this).hide();
			$('.window').hide();
		});
	};
		
	function getSelectedName() {
		return username;	
	};
	function displayNames() {

		// dlg_device
		//  divide type of user
		
		// normal user 
		var all_user = em.accmgr.getUsersName();
		var n_user = all_user.filter( function(el) { return !CDB.getUserInfo(el).options.sp30 
														&&  !CDB.getUserInfo(el).options.pvp;} ) ;

	/*
		var p_user = all_user.filter( function(el) { return CDB.getUserInfo(el).options.pvp; });
			
			
			var s_user = all_user.filter( function(el) { return CDB.getUserInfo(el).options.sp30; });												
	
			// divide  each  server
			var users_arr = [ ];
			users_arr [ 'Active'] = n_user;
			
			$.each(  CDB.SP30.SVRLIST ,  function( i, s) {
				users_arr[ 'SP' + s.server ] = s_user.filter( function(el) { return CDB.getUserServerName(el) == s.server; });
			} 	);											
			
			
			var id_list = [ ];
			
			$('#dlg_username').empty().css({'float':'left'});
			var bg_colors = [ 'aqua', 'fuchsia' , 'silver'] ;
			var i = 0;
			for ( a in users_arr) {
				$('#dlg_username')
					.append( $('<div>').css({'float':'left', 'width':'200px', 'height':'300px', 'background-color':bg_colors[i++]})
						.append( $('<span>').text(a))
						.append( $('<ul></ul>', {'id': a + '_list'}) )	);
						
				id_list.push( a+ '_list');
			}
			
			$.each( n_user, function ( i, name) {
				$('#' + id_list[0] ).append($('<li></li>').text(name));
			} );
	
			$.each( s_user, function ( i, name) {
				$('#' + id_list[1] ).append($('<li></li>').text(name));
			} );
			$.each( p_user, function ( i, name) {
				$('#' + id_list[2] ).append($('<li></li>').text(name));
			} );
			*/
	
		
	
		var p_user = all_user.filter( function(el) { return CDB.getUserInfo(el).options.pvp; });												
		var s_user = all_user.filter( function(el) { return CDB.getUserInfo(el).options.sp30; });												
		
		
		$('#dlg_username').empty()
				.append( $('<span>').text('Active'))
				.append( $('<ul></ul>', {'id': 'normal_user_list'}) )

				.append( $('<span>').text('SP30'))
				.append( $('<ul></ul>', {'id': 'sp30_user_list'}) )

				.append( $('<span>').text('PV'))
				.append( $('<ul></ul>', {'id': 'pv_user_list'}) ) ;

		
		
		
		$.each( n_user, function ( i, name) {
			$('#normal_user_list').append($('<li></li>').text(name));
		} );

		$.each( p_user, function ( i, name) {
			$('#pv_user_list').append($('<li></li>').text(name));
		} );

		$.each( s_user, function ( i, name) {
			$('#sp30_user_list').append($('<li></li>').text(name));
		} );
		
				
		$('#dlg_username > ul > li').click ( function() {
			$('#dlg_username > ul > li').removeClass('selected');
			$(this).addClass('selected');
		// $(this).css( {'background-color': '#Fcc', 'font-size': '20px' });
			em.user.name = $(this).text();
			
			username = $(this).text();
			
			$('#userinfo').html(em.user.name);
			console.log( em.user.name);
		});
		
/*
		$('#dlg_device > ul > li').click ( function() {
			$('#dlg_device > ul > li').removeClass('selected');
			$(this).addClass('selected');
			em.device.name = $(this).text();
			$('#userinfo').html(em.user.name);
			console.log( em.device.name);
		}) ;*/

	};
/*
$('a#newlogind').click( function() {
// after set user.
}); */
	return {
	makeDlg: function() {
		if (init == false ) {
			installhandler();
			displayNames();
			init = true;
		}
		
		debug.log(this, 'this', this, 'call cnt', callCnt++);
		//Get the screen height and width
		var maskHeight = $(document).height();
		var maskWidth = $(window).width();
		
		//Set heigth and width to mask to fill up the whole screen
		$('#mask').css({'width':maskWidth,'height':maskHeight});
		
		//transition effect
		$('#mask').fadeIn(500);
		$('#mask').fadeTo("slow",0.8);
		
		//Get the window height and width
		var winH = $(window).height();
		var winW = $(window).width();
		
		//Set the popup window to center
		$('#changeuser_dlg').css('top', 100);
		$('#changeuser_dlg').css('left', 200);
		

		
		//transition effect
		$('#changeuser_dlg').fadeIn(500);
		

		},
	};
} (); 